<template>
  <div>
    我是home组件

    <el-button type="danger" @click="logout">危险退出</el-button>
  </div>
</template>

<script>
export default {
  name: "",
  components: {},
  props: {},
  data() {
    return {};
  },

  created() {},
  mounted() {},

  // 基于 token 的方式实现退出比较简单，
  // 只需要销毁本地的 token 即可。这样，后续的请求就不会携带 token
  // ，必须重新登录生成一个新的 token 之后才可以访问页面。

  methods: {
    logout() {
      this.$confirm("是否真的要退出?", "", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
        center: true
      })
        .then(() => {
          this.$message({
            type: "success",
            message: "退出成功!",
            duration: 500
          });
          // window.sessionStorage.clear(); // 清除所有的缓存
          window.sessionStorage.removeItem("token"); //清除指定的token
          setTimeout(() => {
            this.$router.replace("/login");
          }, 1000);
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "取消退出",
            duration: 500
          });
        });
    }
  }
};
</script>

<style scoped></style>
